<!-- 企业信息查询 -->
<template>
  <div class="home-page-content">
    <h3 class="mb-20">经营信息预警查询</h3>
    <Form ref="formData" :model="formData" :label-width="80">
      <Row :gutter="30">
        <Col span="6">
          <FormItem label="项目名称" prop="projectName">
            <Input v-model="formData.projectName" placeholder="请输入"></Input>
          </FormItem>
        </Col>
        <Col span="6">
          <FormItem label="信息分类" prop="forewarningInfoClassify">
            <Select v-model="formData.forewarningInfoClassify" placeholder="全部" clearable>
              <Option value="NotReceiveForewarning">经营信息未接收预警</Option>
              <Option value="NotFeedbackForewarning">经营信息未反馈预警</Option>
            </Select>
          </FormItem>
        </Col>
        <Col span="6">
          <FormItem label="组织范围" prop="companyId">
            <OrganizationalTree v-model="formData.companyId" />
          </FormItem>
        </Col>

        <Col span="6" class="com-action-search-btn">
          <Button type="primary" icon="md-search" @click="handleSubmit('formData')">查询</Button>
          <BtnPlain type="primary" @click="handleReset('formData')">
            <Icon type="md-refresh" />
            <span>重置</span>
          </BtnPlain>
        </Col>
      </Row>
    </Form>
    <Table :columns="columns" :data="listData">
      <template slot-scope="{ row }" slot="projectName">
        <BtnText type="primary" @BtnClick="goToBusinessInfo(row)">{{ row.projectName }}</BtnText>
      </template>
      <template slot-scope="{ row }" slot="action">
        <BtnText type="primary" @BtnClick="onView(row)">详情</BtnText>
        <BtnText type="warning" @BtnClick="onSend(row)">发送短信</BtnText>
      </template>
    </Table>
    <PageAtion
      v-if="formData.total"
      :total="formData.total"
      :size.sync="formData.size"
      :page.sync="formData.page"
      @pageSizeChange="pageSizeChange"
    />
  </div>
</template>

<script>
import OrganizationalTree from '@/pages/components/organizationalTree'
import { busiInfoForewarningpPageList, sendForewarningSms } from '@/api/businessInformationManage.js'

export default {
  name: 'businessInformationWarning',
  components: { OrganizationalTree },
  data () {
    return {
      formData: {
        forewarningInfoClassify: '',
        companyId: '',
        projectName: '',
        page: 1,
        size: 10,
        total: 10,
      },
      columns: [
        {
          title: "项目名称",
          key: "projectName",
          slot: 'projectName',
          minWidth: 240
        },
        {
          title: "业主方",
          key: "ownerCompanyName",
          minWidth: 160,
        },
        {
          title: "施工方",
          key: "constructionName",
          minWidth: 160,
        },
        {
          title: "项目地址",
          key: "projectAddressName",
          minWidth: 240,
          tooltip: true
        },
        {
          title: "预计产值规模(万元)",
          key: "outputScale",
          minWidth: 160,
        },
        {
          title: "发布人",
          key: "publisher",
          minWidth: 120,
        },
        {
          title: "经营人员",
          key: "busiPersonName",
          minWidth: 120,
        },
        {
          title: "反馈阶段",
          key: "feedbackPhaseName",
          minWidth: 120,
        },
        {
          title: "信息分类",
          key: "forewarningInfoClassifyName",
          minWidth: 170,
        },
        {
          title: '操作',
          slot: 'action',
          width: 150,
          align: 'center',
          fixed: 'right'
        },
      ],
      listData: []
    };
  },
  created () {
    this.init()
  },
  methods: {
    async init () {
      const request = { ...this.formData }

      const { data, page, size, total } = await busiInfoForewarningpPageList(request)
      this.listData = data
      this.formData = { ...this.formData, ...{ page, size, total } }
    },
    handleReset (name) {
      this.$refs[name].resetFields();
      this.init()
    },
    handleSubmit (name) {
      this.init()
    },
    pageSizeChange () {
      this.init()
    },
    goToBusinessInfo ({ busiInfoId }) {
      this.$router.push({ path: '/businessInformationDetails', query: { busiInfoId, type: 'view', page: 'businessInformationWarning' } })
    },
    onSend (row) {
      let { timeHour, mobile, name, busInfoForewarningId, smsCode } = row
      if (!mobile) {
        this.$Message.error('手机号为空, 无法发送短信!');
        return
      }
      if (!smsCode) {
        this.$Message.error('未配置短信模板, 无法发送短信!');
        return
      }
      timeHour = timeHour < 24 ? `${timeHour}小时` : timeHour / 24 + '天'
      this.$Modal.confirm({
        title: '发送短信',
        okText: '发送',
        width: 550,
        content: `<p>项目名称
          <span class="send-modal-red send-modal-strong">超过${timeHour}未反馈</span> ，
          将发送短信至<span class=" send-modal-strong"> ${name || ''} </span>手机
          <span class=" send-modal-strong">${mobile}</span>上！
          请及时登录到平台查看！
        </p>`,
        onOk: async () => {
          const request = {
            busInfoForewarningId,
            mobile,
            smsCode
          }
          const data = await sendForewarningSms(request)
          const tip = data ? '成功' : '失败'
          this.$Message.success(`短信发送${tip}！`);
        },
      });
    },
    onView ({ busInfoForewarningId, forewarningInfoClassify }) {
      const type = forewarningInfoClassify === 'NotReceiveForewarning' ? 'receive' : 'feedback'
      this.$router.push({ path: '/businessInfoWarningDetails', query: { busInfoForewarningId, type } });
    },
  },
};
</script>

<style lang="less" scoped>
.mb-20 {
  margin-bottom: 20px;
}
</style>

<style lang="less">
.send-modal-red {
  color: #ed4014;
}
.send-modal-strong {
  font-size: 16px;
  font-weight: 500;
}
</style>
